<template>
    <div class="ss">
        <div class="ss-filter">
            <el-form :inline="true" class="demo-form-inline">
                <el-form-item style="flex: 1;">
                    <el-input placeholder="请输入关键字" v-model="schoolname">
                        <template #prepend>
                            <el-select placeholder="学校名称" style="width: 115px">
                                <el-option label="学校名称" value="1" />
                            </el-select>
                        </template>
                    </el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit">查询</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div class="ss-list">
            <div class="ss-list-table">
                <el-table :data="schoolSort" border style="width: 100%;  font-size: 10px;">
                    <el-table-column label="序号" width="60">
                        <template #default="scope">
                            {{ scope.$index + 1 }}
                        </template>
                    </el-table-column>
                    <el-table-column label="地区">
                        <template #default="scope">
                            {{ scope.row.address }}
                        </template>
                    </el-table-column>
                    <el-table-column label="学校名称">
                        <template #default="scope">
                            {{ scope.row.school }}
                        </template>
                    </el-table-column>
                    <el-table-column label="合计">
                        <template #default="scope">
                            {{ scope.row.num
                            }}
                        </template>
                    </el-table-column>
                    <el-table-column label="课程通知">
                        <template #default="scope">
                            {{ scope.row.courseSelectionNotice }}
                        </template>
                    </el-table-column>
                    <el-table-column label="活动">
                        <template #default="scope">
                            {{ scope.row.activity }}
                        </template>
                    </el-table-column>
                    <el-table-column label="公告">
                        <template #default="scope">
                            {{ scope.row.announcement }}
                        </template>
                    </el-table-column>
                    <el-table-column label="请假">
                        <template #default="scope">
                            {{ scope.row.askForLeave }}
                        </template>
                    </el-table-column>
                    <el-table-column label="评价">
                        <template #default="scope">
                            {{ scope.row.evaluation }}
                        </template>
                    </el-table-column>
                    <el-table-column label="放假">
                        <template #default="scope">
                            {{ scope.row.homeMission
                            }}
                        </template>
                    </el-table-column>
                    <el-table-column label="通知">
                        <template #default="scope">
                            {{ scope.row.notice
                            }}
                        </template>
                    </el-table-column>
                    <el-table-column label="付款通知">
                        <template #default="scope">
                            {{ scope.row.noticeOfPayment
                            }}
                        </template>
                    </el-table-column>
                    <el-table-column label="发行专辑">
                        <template #default="scope">
                            {{ scope.row.releaseAlbum
                            }}
                        </template>
                    </el-table-column>
                    <el-table-column label="选票">
                        <template #default="scope">
                            {{ scope.row.vote
                            }}
                        </template>
                    </el-table-column>
                </el-table>
            </div>
        </div>
    </div>
</template>

<script  setup lang="ts">
import server from '@/api/index';
import { ref, onMounted } from 'vue';

let schoolname = ref()
let schoolSort = ref([])

var xi: any
onMounted(async () => {
    var rew = await server.zcg.messageStatistics_schoolMsgNum()
    schoolSort.value = rew.data.data
    // console.log(rew.data.data);
    xi = rew.data.data
})

var onSubmit = () => {
    var ex = JSON.parse(JSON.stringify(xi))
    // console.log(ex);
    schoolSort.value = ex.filter((item: any) => item.school.includes(schoolname.value))
}
</script>

<style  scoped lang="scss">
.ss {
    width: 1320px;
    background: #fff;
    height: 100%;

    .ss-filter {
        width: 85%;
        display: flex;
        justify-content: start;
        align-items: center;
        padding: 20px 20px 0;
        position: relative;
    }

    .ss-list {
        padding: 0 20px 20px;

        .ss-list-fenye {
            margin-top: 15px;
            display: flex;
            justify-content: end;
        }
    }
}
</style>
